<!DOCTYPE html>
<html>
	<head>
		<title>Liquid Layout</title>
		<style type="text/css">
			* {
				font-family: Arial, Verdana, sans-serif;
				color: #665544;
				text-align: center;}
			body {
				width: 90%;
				margin: 0 auto;}
			#content {
				overflow: auto;}
			#nav, #feature, #footer {
				margin: 1%;}
			.column1, .column2, .column3 {
				width: 31.3%;
				float: left;
				margin: 1%;}
			.column3 {
				margin-right: 0%;}
			li {
				display: inline;
				padding: 0.5em;}
			#nav, #footer {
				background-color: #efefef;
				padding: 0.5em 0;}
			#feature, .article {
				height: 10em;
				margin-bottom: 1em;
				background-color: #efefef;}
		</style>
	</head>
	<body>
		<div id="header">
			<h1>Logo</h1>
			<div id="nav">
				<ul>
					<li><a href="">Home</a></li>
					<li><a href="">Products</a></li>
					<li><a href="">Services</a></li>
					<li><a href="">About</a></li>
					<li><a href="">Contact</a></li>
				</ul>
			</div>
		</div>
		<div id="content">
			<div id="feature">
				<p>Feature</p>
			</div>
			<div class="article column1">
				<p>Column One</p>
			</div>
			<div class="article column2">
				<p>Column Two</p>
			</div>
			<div class="article column3">
				<p>Column Three</p>
			</div>
		</div>
		<div id="footer">
			<p>&copy; Copyright 2011</p>
		</div>
	</body>
</html>
